<!doctype html>
<html>
<head>
<meta charset="utf-8">
  <title>淘票票</title>
 <link rel="shortcut icon" href="img/icon.ico">
	 <link type="text/css" rel="stylesheet" href="css/orderStyle.css" /> 
	 


</head>

<body style="overflow-y:scroll;overflow-x:auto;">
	<div id="head">
		<div id="k1">
			<img id="mianIcon" src="img/mian_icon.png">
			<p id="cityName" >杭州</p>
			<div id="menu">
			<a id="aMain">首页</a>
			<a id="aFilm">影片</a>
			<a id="aCinema">影院</a>
			</div>
		</div>
		<div id="k2">
			<table> <tr><td><a id="buyByPhone" ><img src="img/buyByPhone.png">手机购买</a></td>&nbsp;<td><a  id="customerService" ><img src="img/customerService.png">咨询客服</a></td></tr></table>
			
		</div>
	</div>
	<hr>
	<div id="box">
		<table id="progressBar">
			<tr>
				<td class="over"><img src="img/over.png"/>1.选择影片，场次</td>
				<td id="pro2"><img src="img/over.png"/ style="display: none">2.选座，填手机号</td>
				<td id="pro3"><img src="img/over.png"/ style="display: none">3.确认订单，支付</td>
				<td id="pro4"><img src="img/over.png"/ style="display: none">4.支付成功，影院取票观影</td>
			</tr>
		</table>
		<div id="one" class="container">
			<div id="left1">
				<img id="screen" src="img/screen.png"/>
				<p>杭州中影国际影城（星光大道二期店） 【二期】　13号厅 银幕 </p>
				<ol>
					<li>
						<img src="img/seat.png" />
						<img src="img/seat.png" />
						<img src="img/seat.png" />
						<img src="img/seat.png" />
						<img src="img/seat.png" />
						<img src="img/seat.png" />
						&nbsp;&nbsp;
						<img src="img/seat.png" />
						<img src="img/seat.png" />
						<img src="img/seat.png" />
						<img src="img/seat.png" />
						<img src="img/seat.png" />
						<img src="img/seat.png" />
						
					</li>
					<li>
						<img src="img/seat.png" />
						<img src="img/seat.png" />
						<img src="img/seat.png" />
						<img src="img/seat.png" />
						<img src="img/seat.png" />
						<img src="img/seat.png" />
						&nbsp;&nbsp;
						<img src="img/seat.png" />
						<img src="img/seat.png" />
						<img src="img/seat.png" />
						<img src="img/seat.png" />
						<img src="img/seat.png" />
						<img src="img/seat.png" />
						
					</li>		
					<li>
						<img src="img/seat.png" />
						<img src="img/seat.png" />
						<img src="img/seat.png" />
						<img src="img/seat.png" />
						<img src="img/seat.png" />
						<img src="img/seat.png" />
						&nbsp;&nbsp;
						<img src="img/seat.png" />
						<img src="img/seat.png" />
						<img src="img/seat.png" />
						<img src="img/seat.png" />
						<img src="img/seat.png" />
						<img src="img/seat.png" />
						
					</li>	
					<li>
						<img src="img/seat.png" />
						<img src="img/seat.png" />
						<img src="img/seat.png" />
						<img src="img/seat.png" />
						<img src="img/seat.png" />
						&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
						<img src="img/seat.png" />
						<img src="img/seat.png" />
						<img src="img/seat.png" />
						<img src="img/seat.png" />
						<img src="img/seat.png" />
					</li>	
					<li>
						<img src="img/seat.png" />
						<img src="img/seat.png" />
						<img src="img/seat.png" />
						<img src="img/seat.png" />
						<img src="img/seat.png" />
						&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
						<img src="img/seat.png" />
						<img src="img/seat.png" />
						<img src="img/seat.png" />
						<img src="img/seat.png" />
						<img src="img/seat.png" />
					</li>	
					<li>
						<img src="img/seat.png" />
						<img src="img/seat.png" />
						<img src="img/seat.png" />
						<img src="img/seat.png" />
						<img src="img/seat.png" />
						&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
						<img src="img/seat.png" />
						<img src="img/seat.png" />
						<img src="img/seat.png" />
						<img src="img/seat.png" />
						<img src="img/seat.png" />
					</li>	
					<li>
						<img src="img/seat.png" />
						<img src="img/seat.png" />
						<img src="img/seat.png" />
						<img src="img/seat.png" />
						<img src="img/seat.png" />
						&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
						<img src="img/seat.png" />
						<img src="img/seat.png" />
						<img src="img/seat.png" />
						<img src="img/seat.png" />
						<img src="img/seat.png" />
					</li>
					<li>
						<img src="img/seat.png" />
						<img src="img/seat.png" />
						<img src="img/seat.png" />
						<img src="img/seat.png" />
						<img src="img/seat.png" />
						&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
						<img src="img/seat.png" />
						<img src="img/seat.png" />
						<img src="img/seat.png" />
						<img src="img/seat.png" />
						<img src="img/seat.png" />
					</li>
					<li>
						<img src="img/seat.png" />
						<img src="img/seat.png" />
						<img src="img/seat.png" />
						<img src="img/seat.png" />
						<img src="img/seat.png" />
						&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
						<img src="img/seat.png" />
						<img src="img/seat.png" />
						<img src="img/seat.png" />
						<img src="img/seat.png" />
						<img src="img/seat.png" />
					</li>					
				</ol>
				<div id="sample">
					<ul>
						<li><img src="img/seat.png"/>可选座位</li>	
						<li><img src="img/seat_selected.png"/>已选座位</li>
						<li><img src="img/seat_ordered.png"/>不可选座位</li>
					</ul>
					<p>本影厅共有座位142个，当前已售0个</p>
				</div>
			</div>
			<div id="right1">
				<img src="img/SDYJQ9.jpg" />
				<span id="filmInfo"> <h3>速度与激情9 </h3>版本： 英语 3D<br>片长： 142分钟 </span>	
			<table> 
				<tr>
					<td><p class="grayText">影院：</p><h4>杭州中影国际影城（星光大道二期店）</h4></td>
				</tr>
				<tr>
					<td><p class="grayText">影厅：</p><h4>【二期】　11号厅</h4></td>
				</tr>
				<tr>
					<td><p class="grayText">场次：</p><h4 id="time1">6月2日(周三) 12:00</h4></td>
				</tr>
				<tr>
					<td><p class="grayText">座位：</p><br>
						<div class="seatItem">6排16座</div><div class="seatItem">6排16座</div><div class="seatItem">6排16座</div>
						<br>
						<br><span id="numOrdered">已选择<h4>0</h4>个座位，再次点击座位可以取消</span><br><br>
						
					</td>
				</tr>
			</table>
				<hr>
				<div class="price"><p class="grayText">原价：¥55.00 x 1</p></div>
				<div class="price"><p class="grayText">总计：</p><p id="counter">￥55.00</p></div>
				<hr>
				<br>
				<p>&nbsp;&nbsp;&nbsp;接收电子码的手机号(11位)</p>
				<input id="inputPhone" type="text" value="13352175128" /><br>
				<div id="btnConfirm"><p>确认信息，下单</p></div>
			</div>
			<div id="bottom1">
				<br>
				<p>
				<strong>特别提示：</strong><br>
				
    			1、下单前请仔细核对影片、影院、场次、手机号等信息。<br>
    			2、下单后请于15分钟内完成支付，超时系统将不保留座位。<br>
    			3、每笔订单最多可以选择4个座位，请选择连续的座位。<br>
    			4、电影票售出后暂不支持退换 。<br>
				</p>
			</div>
		</div>
		<div id="two" class="container" style="display: none">
			<div id="hintText2"><p class="grayText">订单号：12312312312312445</p><p style="float: right" class="grayText">选座由中影国际提供，客服热线：0571-88157838</p></div>
                  <table id="DataTable"  width="100%" cellspacing="0" cellpadding="0" >
       				 <thead class="table_head" >
       				 <tr>
            			<th width="30%">电影</th>
           			 	<th width="20%">场次</th>
            			<th width="15%">票数/座位</th>
            			<th width="15%">金额小计</th>
						<th width="20%">接受电子码的电话号码</th>
        			</tr>
        			</thead>
       				<tbody id="DataTableInput">
        			<tr>
            			<td>	
							<img src="img/SDYJQ9.jpg" />
							<span id="filmInfo"> <h3>速度与激情9 </h3>版本： 英语 3D<br>片长： 142分钟 </span>	
						</td>
           				<td>
							<p>杭州中影国际影城（星光大道二期店）<br> 【二期】11号厅</p>
							<p>6月2日(周三) 19:20</p>
						</td> 
						<td>
							<p>1张</p>
							<div class="seatItem2">6排16座</div>
						</td>
						<td>￥40.00</td>
						<td>13362784119</td>
						
        			</tr>
        							
        			</tbody>
   					 </table> 
			<div id="sum2"><p>实付款：</p><h4>￥40.00</h4>
				<div id="orderConfirm">确认订单，立即支付</div>
			</div>
			
		</div>
		<div id="three" class="container" style="display: none">
			<table>
				<tr><td>付款成功！</td></tr>
				<tr><td>以下是取票二维码（请及时保存或者在手机上查看）</td></tr>
				<tr><td><img src="img/erWeiMa.png"/></td></tr>
				<tr><td><p>订单号：</p><p>20210605222312138</p></td></tr>
				<tr><td><p>订单生成时间：</p><p>2021-06-05 22：25：00</p></td></tr>
				<tr><td><p>实际支付金额：</p><p>40.00</p></td></tr>
				<tr><td><div id="backMain">返回首页</div></td></tr>
			</table>
		</div>
		
	</div>
	<div id="bottom">
	<table id="tb1">
		<tr>
			
			<td>
				
				<img id="bottomIcon" src="img/textIcon_white.png" ><br>
				<p class="botomText" align="center">如果您是消费者，<br>
				请拨打0571-88157838 <br>
				如果您是影院/合作商家，<br>
				请拨打400-825-9220<br>
				(服务时间:9:00-21:00)</p>
			</td>
			<td>
				
				<b class="botomText2">选座购票流程</b><br>
				<ul >
					<li class="botomText"><a>•选择影片和场次</a></li>
					<li class="botomText"><a>•选择中意的座位</a></li>
					<li class="botomText"><a>•支付并收到取票短信</a></li>
				</ul>
			</td>
			<td>
				<b class="botomText2">取票流程</b><br>
				<ul >
					<li class="botomText"><a>•收到取票短信</a></li>
					<li class="botomText"><a>•影院自助取票</a></li>
					<li class="botomText"><a>•短信重发方式</a></li>
				</ul>
			</td>
			<td>
				<b class="botomText2">常见问题</b><br>
				<ul >
					<li class="botomText"><a>•是否支持退换票</a></li>
					<li class="botomText"><a>•填错手机号怎么办</a></li>
					<li class="botomText"><a>•更多问题>></a></li>
				</ul>
			</td>
			
			<td>
				<div class="blank"></div>
				<b class="botomText2">协议规范</b><br>
				<ul >
					<li class="botomText"><a>•用户服务协议</a></li>
					<li class="botomText"><a>•食品管理规范</a></li>
					<li class="botomText"><a>•隐私权政策</a></li>
					<li class="botomText"><a>•退改签服务费规范</a></li>
				</ul>
			</td>
			<td>
				<img src="img/QR_code.png">
			</td>
		</tr>
		</table>
		<hr id="bottomLine"> 
		<div id="youLian"><p class="botomText"> <a>阿里巴巴集团</a> | <a>阿里巴巴国际站</a> | <a>阿里巴巴中国站</a> | <a>全球速卖通</a> | <a>淘宝网</a> | <a>天猫</a> | <a>聚划算</a> | <a>一淘</a> | <a>阿里妈妈</a> | <a>阿里云计算</a> | <a>云OS</a> | <a>万网</a> | <a>中国雅虎</a> | <a>支付宝</a> </p></div>
			<p style="display: table;margin-left: 260px" class="botomText"> 关于淘宝 合作伙伴 营销中心 联系客服 开放平台 诚征英才 联系我们 网站地图 法律声明 © 2017 Taopiaopiao.com 版权所有<br>
			增值电信业务经营许可证：沪B2-20170117 沪ICP备16050036号-1 营业执照<br>
			违法不良信息举报电话 0571-88157838<br>
			违法不良信息举报邮箱 taopiaopiao_tousu@list.alibaba-inc.com </p>
	</div>
	<img style="display: table;margin: 0 auto" src="img/wangJing.png">
	<script src="js/jquery-3.3.1/jquery-3.3.1.min.js"></script>
		<script src="js/order.js"></script>
</body>
</html>
